<template>
  <van-skeleton title avatar :row="50" :loading="loading">
    <view class="page">
      <view class="home-bg">
        <view class="avatar-box">
          <view class="head-img">
            <image src="@/static/imgs/home_head.png"></image>
          </view>
          <view class="user-info">
            <view class="user-name">{{ userInfo.userName }}</view>
            <view class="user-org">{{ userInfo.deptName }}</view>
          </view>
        </view>
        <view class="scroll-view-box">
          <van-swipe :loop="false" indicator-color="#fff">
            <van-swipe-item>
              <view class="scroll-view-item_H" @click="onTabClick('dbwj')">
                <text class="msg-count">{{ todoTab1 }}</text>
                <text class="msg-title">待办文件</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('dywj')">
                <text class="msg-count">{{ todoTab2 }}</text>
                <text class="msg-title">待阅文件</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('dsqdb')">
                <text class="msg-count">{{ todoTab3 }}</text>
                <text class="msg-title">待审签电报</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('dbhq')">
                <text class="msg-count">{{ todoTab4 }}</text>
                <text class="msg-title">电报会签</text>
              </view>
            </van-swipe-item>
            <van-swipe-item>
              <view class="scroll-view-item_H" @click="onTabClick('dybdb')">
                <text class="msg-count">{{ todoTab5 }}</text>
                <text class="msg-title">待阅办电报</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('dclsw')">
                <text class="msg-count">{{ todoTab6 }}</text>
                <text class="msg-title">待处理收文</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('swbl')">
                <text class="msg-count">{{ todoTab7 }}</text>
                <text class="msg-title">收文办理</text>
              </view>
              <view class="scroll-view-item_H" @click="onTabClick('dsld')">
                <text class="msg-count">{{ todoTab8 }}</text>
                <text class="msg-title">待收来电</text>
              </view>
            </van-swipe-item>
          </van-swipe>
        </view>
      </view>
      <view class="u-padding-bottom-xs">
        <van-notice-bar v-if="noticeList != null && noticeList.length > 0" left-icon="volume-o"
                        :scrollable="false" background="#ffffff" color="#2979ff" mode="link">
          <van-swipe vertical class="notice-swipe" :autoplay="3000" :show-indicators="false">
            <van-swipe-item v-for="(item,index) in noticeList" @click="noticeDetail(item)">
              <template #default>
                <van-tag v-if="item.tgType == '2'" mark type="danger">紧急</van-tag>
                <span>{{ item.title }}</span>
              </template>
            </van-swipe-item>
          </van-swipe>
          <template #right-icon>
            <van-icon name="arrow" @click="noticeMore"/>
          </template>
        </van-notice-bar>

        <view class="item-box">
          <view class="right-top-icon" @click="editIcon">
            <image src="/static/imgs/right-top-icon.png"></image>
          </view>
          <view class="right-top-uicon" @click="editIcon">
            <u-icon name="edit-pen-fill" color="#FFFFFF" size="30"></u-icon>
          </view>

          <van-grid :border="false" :column-num="4" class="ugrid">
            <van-grid-item v-for="(item,index) in arrList" :key="item.id" @click='onClick(item.id)'>
              <van-icon :name="item.name" size="24" :color="item.color"/>
              <view class="grid-text">{{ item.title }}</view>
            </van-grid-item>
          </van-grid>
        </view>
      </view>
      <view class="padding-top-xs">
        <docs ref="docList"></docs>
        <van-cell title="" is-link @click="toMore('doc')" value="更多" value-class="text-sm"/>
      </view>
      <view class="padding-top-sm">
        <news ref="newsList"></news>
        <van-cell title="" is-link @click="toMore('news')" value="更多" value-class="text-sm"/>
      </view>
      <van-divider :style="{ color: '#969799', borderColor: '#d3d0d5', padding: '0 16px' }">没有更多内容了</van-divider>
      <van-button @click="openFile">测试打开DOC</van-button>
      <van-button @click="openWps">测试打开WPS</van-button>
      <van-button @click="openOfd">测试打开OFD</van-button>
    </view>
  </van-skeleton>
</template>
<script>
import news from 'pages/caac/components/newsList/compo-news.vue';
import docs from 'pages/caac/components/newsList/compo-docs.vue';
import Toast from 'vant';

export default {
  components: {
    news,
    docs
  },
  data() {

    return {
      userInfo: {}, //当前登录用户信息，目前先从缓存中获取
      todoTab1: 0, //待办文件
      todoTab2: 0, //待阅文件
      todoTab3: 0, //待审签电报
      todoTab4: 0, //电报会签
      todoTab5: 0, //待阅办电报
      todoTab6: 0, //待处理收文
      todoTab7: 0, //收文办理
      todoTab8: 0, //待收来电
      page: 1,
      rows: 1,
      loading: true,
      //通知公告滚动数据
      noticeList: [],
      arrList: [{
        id: 1,
        name: 'todo-list-o',
        title: '文件办理',
        color: '#5998ff'
      },
        {
          id: 6,
          name: 'description',
          title: '电报办理',
          color: '#5ae5ef'
        },
        {
          id: 2,
          name: 'eye-o',
          title: '跟踪',
          color: '#ffbb5a'
        },
        {
          id: 3,
          name: 'search',
          title: '查询',
          color: '#5ae5ef'
        },
        {
          id: 4,
          name: 'star-o',
          title: '收藏',
          color: '#ffaca0'
        },
        {
          id: 5,
          name: 'orders-o',
          title: '新闻',
          color: '#d48dff'
        },
      ],
    }
  },
  onLoad:  function (option) {

  },
  async mounted() {
    await this.$onLaunched //解決bug：执行完onLaunch后再执行页面onLoad
    this.userInfo = this.cache.get('userInfo') //从缓存获取用户信息userInfo: {"systemKey":"ls_liu","systemFlag":"yidong"}
//    this.$toast(JSON.stringify(this.userInfo))
	this.loading = false;
    this.daibanWorks()//待办文件
    this.dyworks()//待阅文件
    this.mhjDbSqWorks()//待审签电报
    this.mhjDbHqWorks()//电报会签
    this.mhjDbYbWorks()//待阅办电报

    this.getSwListData() //获取待处理收文待办数量
    // this.queryGwhgList() //获取待核收文待办数量--不确定有没有
    this.pengdinglist() //待收来电数量
    this.getSwblListData() // 收文办理-待办
    this.getNoticeList() // 获取通知公告
  },
  methods: {
    onClick(id) {
      //直接跳转带参数
      if (id == 1) { //待办
        uni.navigateTo({
          url: "/pages/caac/send/signList?topShow=dbwj"
        })
      } else if (id == 2) { //公文跟踪
        uni.navigateTo({
          url: "/pages/caac/index/trace"
        })
      } else if (id == 3) { //查询
        uni.navigateTo({
          url: "/pages/caac/index/search"
        })
      } else if (id == 4) {//收藏
        uni.navigateTo({
          url: "/pages/caac/index/collection"
        })
      } else if (id == 5) {//新闻
        uni.navigateTo({
          url: '/pages/caac/components/newsList/compo-index?activeName=' + 'zywj'
        })
      } else if (id == 6) { //待办电报
        uni.navigateTo({
          url: "/pages/caac/send/signListdb?topShow=dsqdb"
        })
      }
    },

    editIcon() {
      this.$router.push({
        path: '/pages/caac/column/column',
        query: {
          setid: 0
        }
      });
    },
    onTabClick(tabIndex) {
      // 文件办理：wjbl，文件会签：wjhq，局内文件：jnwj，待阅办文件：dybwj，分发公文：ffgw，待审签电报：dsqdb，待阅办电报：dybdb，
      // 分发公文（电报）：ffgwdb，带处理收文：dclsw，收文办理：swbl，待核收文：dhsw，代收来电：dsld
      if (tabIndex == 'dclsw') { //dsld-待收来电
        uni.navigateTo({
          url: '/pages/caac/receive/todoDoc'
        })
      } else if (tabIndex == 'swbl') {
        //收文办理
        uni.navigateTo({
          url: '/pages/caac/receive/doList'
        })
      }/* else if (tabIndex == 'dhsw') {
					// this.$toast('待核收文')
					uni.navigateTo({
						url: '/pages/caac/receive/uncheckDoc'
					})
				}*/ else if (tabIndex == 'dsld') {
        uni.navigateTo({
          url: '/pages/caac/receiveMsg/receive-call'
        })
      } else if (tabIndex == 'dsqdb' || tabIndex == 'dbhq' || tabIndex == 'dybdb') {//跳转电报列表
        uni.navigateTo({
          url: '/pages/caac/send/signListdb?topShow=' + tabIndex
        })
      } else {
        uni.navigateTo({
          url: "/pages/caac/send/signList?topShow=" + tabIndex
        })
      }
    },

    //待办文件
    daibanWorks() {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/todowork/daibanWorks`),
        method: 'get',
        params: this.$http.adornParams({
          'title': '',//查询传
          'bizTypeCode': '',//查询传
          'todoTab': 0,//固定值
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey, //固定值
          'systemFlag': this.userInfo.systemFlag, //固定值
        })
      }).then(({data}) => {
        if (data.code == 200) {
          this.todoTab1 = data.data.total
        }
      })
    },
    //待阅文件
    dyworks() {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/todowork/dyworks`),
        method: 'get',
        params: this.$http.adornParams({
          'title': '',//查询传
          'bizTypeCode': '',//查询传
          'todoTab': 3,//固定值
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey, //固定值
          'systemFlag': this.userInfo.systemFlag, //固定值
        })
      }).then(({data}) => {
        if (data.code == 200) {
          this.todoTab2 = data.data.total
        }
      })
    },

    //待审签电报
    mhjDbSqWorks() {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/mhjdb/mhjDbSqWorks`),
        method: 'get',
        params: this.$http.adornParams({
          'title': '',//查询传
          'bizTypeCode': '',//查询传
          'todoTab': 2,//固定值
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey, //固定值
          'systemFlag': this.userInfo.systemFlag, //固定值
        })
      }).then(({data}) => {
        if (data.code == 200) {
          this.todoTab3 = data.data.total
        }
      })
    },
    //电报会签
    mhjDbHqWorks() {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/mhjdb/mhjDbHqWorks`),
        method: 'get',
        params: this.$http.adornParams({
          'title': '',//查询传
          'bizTypeCode': '',//查询传
          'todoTab': 2,//固定值
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey, //固定值
          'systemFlag': this.userInfo.systemFlag, //固定值
        })
      }).then(({data}) => {
        if (data.code == 200) {
          this.todoTab4 = data.data.total
        }
      })
    },
    //待阅办电报
    mhjDbYbWorks() {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/mhjdb/mhjDbYbWorks`),
        method: 'get',
        params: this.$http.adornParams({
          'title': '',//查询传
          'bizTypeCode': '',//查询传
          'todoTab': 3,//固定值
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey, //固定值
          'systemFlag': this.userInfo.systemFlag, //固定值
        })
      }).then(({data}) => {
        if (data.code == 200) {
          this.todoTab5 = data.data.total
        }
      })
    },
    //待处理收文
    getSwListData() {
      var _this = this
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/fwend/getSwListData`),
        method: 'get',
        params: this.$http.adornParams({
          'ACCEPT_TYPE': 'IS NULL',
          'ACCEPT_DEPT': this.cache.get('userInfo').mainDept.deptCode,
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey, //固定值
          'systemFlag': this.userInfo.systemFlag, //固定值
        })
      }).then(({
                 data
               }) => {

        if (data.code == 200) {
          _this.todoTab6 = data.data.total
        }
      })
    },
    // 收文办理-待办
    getSwblListData() {
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/swbanli/getMhjSwBanLiList`),
        method: 'post',
        params: this.$http.adornParams({
          'systemKey': this.cache.get('userInfo').systemKey,
          'systemFlag': this.cache.get('userInfo').systemFlag,
          'page': this.page,
          'rows': this.rows,
          'isJldps': 1,
          'swWord': ""
        })
      }).then(({
                 data
               }) => {
        if (data.code == 200) {
          this.todoTab7 = data.data.total
        }
      })

    },
    //获取待核收文待办数量
    // queryGwhgList() {
    // 	var _this = this
    // 	this.$http({
    // 		url: this.$http.adornUrl(`/caac/oa/doc/gwhgList/queryGwhgList`),
    // 		method: 'get',
    // 		params: this.$http.adornParams({
    // 			'gwhgStatus': 1,
    // 			'page': this.page,
    // 			'rows': this.rows,
    // 			'systemKey': this.userInfo.systemKey, //固定值
    // 			'systemFlag': this.userInfo.systemFlag, //固定值
    // 		})
    // 	}).then(({
    // 		data
    // 	}) => {
    // 		console.log("data: " + JSON.stringify(data));
    // 		if (data.code == 200) {
    // 			_this.todoTab8 = data.data.total
    // 		}
    // 	})
    // },

    //获取待收来电数量
    pengdinglist() {
      var _this = this
      this.$http({
        url: this.$http.adornUrl(`/caac/oa/doc/fdpengding/pengdinglist`),
        method: 'get',
        params: this.$http.adornParams({
          'acceptType': 1,
          'page': this.page,
          'rows': this.rows,
          'systemKey': this.userInfo.systemKey, //固定值
          'systemFlag': this.userInfo.systemFlag, //固定值
        })
      }).then(({
                 data
               }) => {
        // console.log(data)
        if (data.code == 200) {
          _this.todoTab8 = data.data.total
        }
      })
    },
    // 获取通知公告
    getNoticeList() {
      let _this = this
      _this.$http({
        url: _this.$http.adornUrl(`/caac/oa/annunciate/findAnnunciateListByUserId`),
        method: 'get',
        params: _this.$http.adornParams({
          'systemKey': this.userInfo.systemKey,
          'systemFlag': this.userInfo.systemFlag,
          'userId': this.userInfo.userId
        })
      }).then(({
                 data
               }) => {
        if (data.code == 200) {
          _this.noticeList = data.data
        }
      })
    },
    // 点击通知消息跳转详情
    noticeDetail(item) {
      uni.navigateTo({
        url: '/pages/caac/components/newsList/compo-detail?from=notice',
        success: function (res) {
          // 通过eventChannel向被打开页面传送数据
          res.eventChannel.emit('acceptDataFromOpenerPage', item)
        }
      })
    },
    noticeMore() {
      uni.navigateTo({
        url: '/pages/caac/components/newsList/compo-notice'
      })
    },

    // 更多
    toMore(type) {
      let activeName = ''
      if (type == 'doc') {
        activeName = this.$refs.docList.activeName
      } else {
        activeName = this.$refs.newsList.activeName
      }
      uni.navigateTo({
        url: '/pages/caac/components/newsList/compo-index?activeName=' + activeName
      })
    },
    openFile() {
      this.lx.openFileDetail("test.docx", 'docx', 'http://49.232.172.163:8080/test.docx', 'http://www.baidu.com', this.lx.openMode.readOnly)
    },
    openWps() {
      this.lx.openFileDetail("test.wps", 'docx', 'http://49.232.172.163:8080/test.wps', 'http://www.baidu.com', this.lx.openMode.readOnly)
    },
    openOfd() {
      this.lx.openFileDetail("test.ofd", 'ofd', 'http://49.232.172.163:8080/test.ofd', 'http://www.baidu.com', this.lx.openMode.readOnly)
    }
  },

}
</script>

<style scoped>
	/* 最上边背景图片 */
		.home-bg {
			width: 100%;
			height: 350rpx;
			border-top-left-radius: 25rpx;
			border-top-right-radius: 25rpx;
			background: url(../../../static/imgs/home-bg.png) repeat bottom center;
		}

  /* 头像信息区 */
  .avatar-box {
    display: flex;
    flex-direction: row;
    width: auto;
    height: 50%;
    align-items: center;
    padding-left: 80rpx;
    padding-top: 50rpx;;
  }

  .avatar-box image {
    height: 110rpx;
    width: 110rpx;
    border-radius: 20%;
  }

  .avatar-box .user-info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-left: 28rpx;
    height: 90rpx;
    width: 300rpx;
  }

  .user-info .user-name {
    line-height: 40rpx;
    font-size: 38rpx;
    font-weight: 800rpx;
    color: #FFFFFF;
  }

  .user-info .user-org {
    font-size: 24rpx;
    color: #FFFFFF;
    padding-bottom: 10rpx;
  }

		.scroll-view-box {
			/*display: flex;
			flex-direction: row;*/
	    width: 100%;
			align-items: center;
	    margin-top: 36rpx;
		}

		/* 滑动区域 */
		.scroll-view_H {
			/* 文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。 */
			flex-direction: row;
			white-space: nowrap;
			width: 100%;
			height: 190rpx;

		}

		.scroll-view-item_H {
			display: inline-flex;
			flex-direction: column;
			justify-content: flex-end;
			align-items: flex-end;
			width: 25%;
			height: 100%;
		}

		.scroll-view-item_H .msg-count {
			margin-bottom: 15rpx;
			width: 100%;
			font-size: 28rpx;
			font-weight: bold;
			text-align: center;
			color: #FFFFFF;
		}

		.scroll-view-item_H .msg-title {
			margin-bottom: 55rpx;
			width: 100%;
			font-size: 28rpx;
			text-align: center;
			color: #FFFFFF;
		}

		.ugrid {
			margin-top: 30rpx;
			padding: 0 0px;
	    background-color: #FFFFFF;
	    width: 100%;
		}

		.grid-text {
			font-size: 28rpx;
			margin-top: 4rpx;
			color: $u-type-info;
		}

	  /* 右上角角标开始 */
	  .item-box{
	    position: relative;
	    display: flex;
	    flex-direction: row;
	    background-color: #FFFFFF;
	    border-radius: 20rpx;
	    align-items: center;
	    box-shadow: 2rpx 4rpx 10rpx #d8d8d8;
	    margin-top: 10rpx;
	  }

	  .right-top-icon{
	    position: absolute;
	    top: 0;
	    right: 0;
	    width: 72rpx;
	    height: 76rpx;
	    z-index: 10;
	  }
	  .right-top-icon image{
	    display: inline;
	  }
	  .right-top-uicon{
	    position: absolute;
	    top: 6rpx;
	    right: 0rpx;
	    width: 40rpx;
	    height: 40rpx;
	    z-index: 20;
	  }
	  .right-top-uicon u-icon{
	    display: inline;
	    width: 100%;
	    height: 100%;
	  }
	  /* 右上角角标结束 */

	  /deep/.van-grid-item__content {
	    padding: 8px 8px;
	  }

	  .notice-swipe {
	    height: 40px;
	    line-height: 40px;
	  }
</style>
